<template>
    <div class="foodList">
        <div class="first">
            <div class="food">
                <img src="../../../img/food1.png" alt="">
                <span>美食</span>
            </div>
            <div class="food">
                <img src="../../../img/food2.png" alt="">
                <span>猫眼电影</span>
            </div>
            <div class="food">
                <img src="../../../img/food3.png" alt="">
                <span>酒店</span>
            </div>
            <div class="food">
                <img src="../../../img/food4.png" alt="">
                <span>休闲娱乐</span>
            </div>
            <div class="food">
                <img src="../../../img/food5.png" alt="">
                <span>外卖</span>
            </div>
        </div>
        <div class="second">
            <div class="food">
                <img src="../../../img/food6.png" alt="">
                <span>KTV</span>
            </div>
            <div class="food">
                <img src="../../../img/food7.png" alt="">
                <span>周边游</span>
            </div>
            <div class="food">
                <img src="../../../img/food8.png" alt="">
                <span>丽人</span>
            </div>
            <div class="food">
                <img src="../../../img/food9.png" alt="">
                <span>母婴亲子</span>
            </div>
            <div class="food">
                <img src="../../../img/food10.png" alt="">
                <span>全部分类</span>
            </div>
        </div>
    </div>
</template>

<script>
export default{
    name:'FoodList',
    data(){}
}
</script>

<style lang="scss" scoped>
.foodList{
    width: 702px;
    height: 300px;
    padding: 20px 24px;
    .first,.second{
        display:flex;
        align-items: center;
        justify-content:space-between;
    }
        .food{
        width: 100px;
        height: 130px;
        display: flex;
        flex-direction: column;
        align-items: center;
        img{
            width: 84px;
            height: 84px;
        }
        span{
            color: #333;
            font-size: 24px;
        }
    }
    .second{
        margin-top: 35px;
    }
}
</style>